<template>
  <div class="errPage-container">
    <div class="error-inner">
      <el-row>
        <el-col :span="12">
          <h1 class="text-jumbo text-ginormous">
            验证失败
          </h1>
          <h2>登录过期！</h2>
          <h6>对不起，您的登录已经过期，请重新登录！</h6>
        </el-col>
        <el-col :span="12">
          <img :src="'./assets/error/401.gif'"
               width="313"
               height="428"
               alt="Girl has dropped her ice cream." />
        </el-col>
      </el-row>
    </div>
  </div>
</template>

<script  lang="ts" setup>

</script>

<style lang="scss" scoped>
.errPage-container {
    @include hor-group(center,center);
    width:100%;
    height:100%;
    overflow: hidden;

    .error-inner{
        flex:none;
        width: 800px;
    }
    .pan-back-btn {
        background: #008489;
        color: #fff;
        border: none !important;
    }
    .pan-gif {
        margin: 0 auto;
        display: block;
    }
    .pan-img {
        display: block;
        margin: 0 auto;
        width: 100%;
    }
    .text-jumbo {
        font-size: 60px;
        font-weight: 700;
        color: #484848;
    }
    .list-unstyled {
        font-size: 14px;
        li {
            padding-bottom: 5px;
        }
        a {
            color: #008489;
            text-decoration: none;
            &:hover {
                text-decoration: underline;
            }
        }
    }
}
</style>
